<template>
  <!-- 项目信息详情 -->
  <div class="app-container-detail">
    <!-- 功能按钮 -->
    <el-row :gutter="10" class="button-wrap">
      <el-col :span="1.5">
        <el-button icon="el-icon-arrow-left" size="middle" @click="handleReturn()">返回</el-button>
      </el-col>
    </el-row>
    <!-- form表单 -->
    <div class="main-content">
      <el-card class="box-card" shadow="never">
        <div class="main-content-body">
          <div class="detail-item">
            <div class="two-level-title">基本信息</div>
            <table class="detail-table" cellpadding="0" cellspacing="0">
              <tr>
                <td>
                  <span class="labelTitle">项目名称</span>
                </td>
                <td>
                  <span class="infoText">{{ formData.proName }}</span>
                </td>
                <td>
                  <span class="labelTitle">试验类型</span>
                </td>
                <td>
                  <span class="infoText">{{ formData.experimentType }}</span>
                </td>
                <td>
                  <span class="labelTitle">试验单位</span>
                </td>
                <td>
                  <span class="infoText">{{ formData.companyId }}</span>
                </td>
                <td>
                  <span class="labelTitle">委托单位</span>
                </td>
                <td>
                  <span class="infoText">{{ formData.clientEnterpriseId }}</span>
                </td>
              </tr>
              <tr>
                <td>
                  <span class="labelTitle">联系电话</span>
                </td>
                <td>
                  <span class="infoText">{{ formData.contactsPhone }}</span>
                </td>
                <td>
                  <span class="labelTitle">联系人</span>
                </td>
                <td>
                  <span class="infoText">{{ formData.clientContacts }}</span>
                </td>
                <td>
                  <span class="labelTitle">完成日期</span>
                </td>
                <td colspan="3">
                  <span class="infoText">{{ formData.finishDate }}</span>
                </td>
              </tr>
              <tr>
                <td>
                  <span class="labelTitle">要求说明</span>
                </td>
                <td colspan="7">
                  <span class="infoText">{{ formData.remark }}</span>
                </td>
              </tr>
            </table>
          </div>
          <el-form :inline="true" label-width="auto">
            <el-form-item label="" prop="experimentFileList">
              <label slot="label" v-html="`委&ensp;托&ensp;单`" />
              <FileUplode
                ref="fileUplode"
                :edit-file-list="experimentFileList"
                :status="status"
                :read-only="true"
                @getFileList="getReport"
              />
            </el-form-item>
          </el-form>
        </div>
      </el-card>
    </div>
  </div>
</template>
<script>
// 上传文件
import FileUplode from '@/components/Upload/FileUplode'
import { getTestById } from '@/api/projectManage/ProjectAllocation/testCommission'
export default {
  components: {
    FileUplode
  },
  data() {
    return {
      TypeOptions: [
        {
          value: '0',
          label: '标准固结实验'
        },
        {
          value: '1',
          label: '快速固结实验'
        },
        {
          value: '2',
          label: '其他'
        }
      ],
      TestOptions: [
        {
          value: '0',
          label: '中佳实验室'
        },
        {
          value: '1',
          label: '石家庄冰川实验室'
        }

      ],
      experimentFileList: [], // 回显委托单
      status: '',
      /* 表单 start */
      formData: {
        proId: '',
        proName: '', // 项目名称
        experimentType: '', // 试验类型
        companyId: '', // 试验单位
        clientEnterpriseId: '', // 委托单位
        clientContacts: '', // 联系人
        contactsPhone: '', // 联系电话
        finishDate: '', // 完成日期
        experimentFileList: '' // 委托单
      }
    }
  },

  mounted() {
    const { proId, proName, id } = this.$route.query
    this.formData.proId = proId
    this.formData.proName = proName
    this.handleDetail(id)
  },
  methods: {
    async handleDetail(id) {
      const { data } = await getTestById(id)
      this.formData = { ...this.formData, ...data }
    },
    // 委托单
    getTrustDeed(fileList) {
      this.formData.experimentFileList = fileList
    },
    // 返回
    handleReturn() {
      this.$router.go(-1)
    }
    /* 新增/编辑弹层 end*/
  }

}
</script>

<style lang="scss">
</style>

